<template>
	<yd-layout id='bdIndex'>
		<div class="header">
			<div class="title ">新人起步宝典</div>
			<span  class="label c_size_34_48">直销人成功的启蒙工具教材，让新人从起步学会正确运作直销</span>
		</div>
			
		<div class="content">
			<div class="code" v-if="!isActiveData">
				<div class="input_code_f">
					<input 
						class="input_code" 
						pattern="\d*"  
						maxlength="15"
						oninput="if(value.length>15)value=value.slice(0,15)"
						v-model.trim="code" 
						type="number" 
						placeholder="输入宝典激活码" />
				</div>
				<!--这个写一个组件，后期好像用的比较多-->
				<div class="jh_btn">
					<span @click="activeCode">立即激活</span>
					<div class="jh_btn_back"></div>
				</div>
				<img class="down_img" src="../../../assets/bd_img/down.png" alt="" />
				<div class="text_label c_size_34_48">没有激活码？ </div>
				<div class="text_label c_size_34_48">点击下方购买获得激活码</div>
				<img class="buy_img" @click="goGoodsDetail" src="../../../assets/bd_img/index.png" alt="" />
			</div>
			<div v-else class="nav">
				<div class="nav_list " @click="goNextPage(item)" v-for="item,index in levelsList">
					<div class="nav_list_1 nav_color_1" :class="'nav_color_'+(index+1)">{{item.name}}</div>
					<div class="nav_list_right">
						<div class="nav_list_2">{{item.title}}</div>
						<img class="nav_list_img" src="../../../assets/bd_img/right.png" alt="" />
					</div>
				</div>
			</div>
		</div>
		<div slot='bottom' v-if="course&&course!='{}'"  class="study_toast">
			<div class="toast"> 
				<div class="toast_left c_size_30_42">
					<div>上次学到： </div>
					<div class="c_text_ellipsis_1">{{course.level_name}}-{{course.title}}</div>
				</div>
				<div class="toast_btn" @click="goStudy">继续学</div>
			</div>
		</div>
	</yd-layout>
	
</template>

<script>
	//import mixinIndex from '../../mixin/mixinIndex.js'
	import Footer from '../../../components/Footer/Footer.vue' 
	import {InfiniteScroll} from 'vue-ydui/dist/lib.rem/infinitescroll';
	import {BackTop} from 'vue-ydui/dist/lib.rem/backtop';
	import {Popup} from 'vue-ydui/dist/lib.rem/popup';
	export default{
		mixins:[],
		components:{
			[Footer.name]:Footer,
			[InfiniteScroll.name]:InfiniteScroll,
			[BackTop.name]:BackTop,
			[Popup.name]:Popup,
		},
		data(){
			return {
				isActiveData:true,
				liveList:[],
				pageNum:1,
				pageCount:10,
				showPop:false,
				teacherList:[],//讲师团队列表
				passwordNum:'',
				listObj:{},
				mineObj:{},
				code:'',//激活码
				course:'',
				levelsList:[],
			}
		},
		created() {
			
		},
		watch: {
			
		},
		computed: {
			
		},
		async mounted(){
			document.title='新人宝典'
			var ua = navigator.userAgent;
			if(this.$root.isPc!='pc'&&ua.match(/MicroMessenger/i) != 'MicroMessenger'&&(this.$root.isPcOS=='Phone'||this.$root.isPcOS=='Linux')){
				await this.getToken()
			}
			
			this.isActive()
			//分享
			if(this.$root.isWeiXin()){
				//分享
				let query = '';
				if(this.$root.config.channel){
				 	query = `params=channelDY2FGoldUrlStrDY${this.$route.name}`
				}else{
				 	query = `params=channelDY2FGoldUrlStrDY${this.$route.name}`
				}
				this.$root.wxShare({
					d:{title:`新人起步宝典`,title_img:this.$root.config.shareImg},//分享对象，题目等{title:'',title-img:''}
					query: query,//参数
					desc:`新人正确起步的启蒙工具教材`//分享详情
				})
			}
		},
		methods:{
			//继续学
			goStudy(){
				this.$router.push({
					name:'bd_studyStageDetailVideo',
					query:{
						id:this.course.id
					}
				})
			},
			//去下一个页面
			goNextPage(item){
				this.$router.push({
					name:'bd_studyStage',
					query:{
						id:item.id
					}
				})
			},
			goGoodsDetail(){
				this.$router.push({
					name:"bd_goodsDetail"
				})
			},
			//激活码
			activeCode(){
				//激活码错误，请重新输入
				//激活码已被使用，请重新输入
				//激活成功
				if(this.code){
					console.log(this.code)
					if((this.code+'').length==15){
						
		                this.$root.ajax({
							name:'bible/active',
							params:{
								code:(this.code+'')
							}
						}).then((d)=>{
							if(d.code==0){
								this.$dialog.toast({
				                    mes: '激活成功', 
				                    timeout: 1500,
				                    callback: () => {
				                        this.isActiveData=true;
				                    }
				                });
				                this.getLevels()
							}
						})
					}else{
						this.$dialog.toast({
		                    mes: '请输入15位激活码', 
		                    timeout: 1500
		                });
					}
						
				}else{
					this.$dialog.toast({
	                    mes: '请输入激活码', 
	                    timeout: 1500
	                });
				}
			},
			//阶段列表
			getLevels() {
				this.$root.ajax({
					name: 'bible/levels',
					type:"get",
					params: {}
				}).then((d) => {
					this.levelsList = d.data.level_list
					if(d.data.course && d.data.course != '{}') {
						this.course = d.data.course
					}

				})
			},//安卓，苹果端登录
			getToken(){
				return new Promise((resolve,reject)=>{
					let params = {};
					if(this.$root.isPc()=='android'){
						params={
							uid:this.$root.config.androidOrIosObj.user_uid,
							nick_name:this.$root.config.androidOrIosObj.user_name,
							avatar:this.$root.config.androidOrIosObj.user_photo,
							client:1,//1安卓，2ios。3web
							item:2,//1、报名通道；2、直销万事通APP
							channel:this.$root.config.channel,
							mobile:'',
						}
					}else{
						params={
							uid:this.$root.config.androidOrIosObj.user_uid,
							nick_name:this.$root.config.androidOrIosObj.user_name,
							avatar:this.$root.config.androidOrIosObj.user_photo,
							client:2,//1安卓，2ios。3web
							item:2,//1、报名通道；2、直销万事通APP
							channel:this.$root.config.channel,
							mobile:'',
						}
					}
					this.$root.ajax({
						name:'Index/loginin',
						params:params
					}).then((d)=>{
						this.$root.userInfo=d.data
						sessionStorage.setItem('wst_xiruixy_userInfo',JSON.stringify(d.data));
						resolve()
					})
				})
			},
			//是否激活
			isActive(){
				this.$root.ajax({
					name:'bible/isActive',
					type:'get',
					params:{}
				}).then((d)=>{
					this.isActiveData=d.data
					if(d.data){
						this.getLevels()
					}
				})
			},
		}
	}
</script>

<style lang="scss">
	@import './index.scss';
</style>